import { HttpContext } from '@angular/common/http';
import { ChangeDetectorRef, Component, ViewChild } from '@angular/core';
import { STColumn, STComponent, STPage } from '@delon/abc/st';
import { XlsxService } from '@delon/abc/xlsx';
import { ALLOW_ANONYMOUS } from '@delon/auth';
import { _HttpClient } from '@delon/theme';
import { NzMessageService } from 'ng-zorro-antd/message';
import { NzModalRef } from 'ng-zorro-antd/modal';

import { Api } from '../../../shared/api/api';
import { ResponseCode } from '../../../shared/response.code';
import {UserEditComponent} from "./user-edit.component";
import {UserEditContractComponent} from "./user-edit-contract.component";

@Component({
  selector: 'components-user-detail',
  template: `
    <sv-container>
      <sv-title>基本信息</sv-title>
      <sv label="姓名">{{ record.name }}</sv>
      <sv label="线索来源">{{ record.xs_source }}</sv>
      <sv label="手机">{{ record.phone }}</sv>
      <sv label="微信号">{{ record.wxchat }}</sv>
      <sv label="性别">{{ record.six }}</sv>
      <sv label="公司名称">{{ record.company_name }}</sv>
      <sv label="行业">{{ record.industry }}</sv>
      <sv label="企业规模">{{ record.company_num }}</sv>
      <sv label="成立日期">{{ record.company_creat_time }}</sv>
      <sv label="注册资本">{{ record.company_money }}万</sv>
      <sv label="统一社会信用代码">{{ record.company_code }}</sv>
      <sv label="地址">{{ record.company_address }}</sv>
      <sv label="项目服务种类">{{ record.business_style }}</sv>
      <sv label="线索阶段">{{ record.last_flow_up_name ? '已分配' : '未分配' }}</sv>
    </sv-container>
    <sv-container>
      <sv-title></sv-title>
      <sv-title>合同信息</sv-title>
      <sv-title></sv-title>
    </sv-container>
    <nz-card>
      <st #st1 [data]="contract" [columns]="contractColumns" [pi]="page.current" [ps]="page.size" [total]="page.total" [page]="pagination"></st>
    </nz-card>
    <sv-container>
      <sv-title></sv-title>
      <sv-title>记录信息</sv-title>
      <sv-title></sv-title>
    </sv-container>
    <nz-card>
      <st #st [data]="page.data" [columns]="columns" [pi]="page.current" [ps]="page.size" [total]="page.total" [page]="pagination"></st>
    </nz-card>
  `
})
export class ComponentsUserDetailComponent {
  record: any = {};
  contract: any = [];
  page: any = {
    data: [],
    current: 1,
    total: 1,
    size: 10
  };
  pagination: STPage = {
    front: false,
    pageSizes: [10, 20, 30, 40, 50],
    total: true,
    showSize: true,
    showQuickJumper: true
  };
  @ViewChild('st', { static: true }) st!: STComponent;
  columns: STColumn[] = [
    { title: '编号', index: 'id' },
    { title: '创建人', index: 'user_name' },
    { title: '内容', index: 'content' },
    { title: '创建时间', index: 'creat_time' }
  ];
  @ViewChild('st1', { static: true }) st1!: STComponent;
  contractColumns: STColumn[] = [
    { title: '编号', index: 'contract_num' },
    { title: '金额', index: 'contract_money' },
    { title: '已收款', index: 'contract_receive' },
    { title: '尾款', index: 'contract_off_money' },
    { title: '成本', index: 'contract_cost' },
    { title: '服务期限', index: 'contract_time' },
    {
      title: '合同截图',
      type: 'img',
      index: 'contract_url'
    },
    {
      title: '收款截图',
      type: 'img',
      index: 'contract_pay_url'
    },
    {
      title: '操作',
      buttons: [
        {
          text: '编辑',
          type: 'modal',
          modal: {
            component: UserEditContractComponent
          },
          click: () => {
            this.st.reload();
          }
        }]
    }
  ];

  constructor(
    private xlsx: XlsxService,
    private modal: NzModalRef,
    protected http: _HttpClient,
    private msgSrv: NzMessageService,
    private cdr: ChangeDetectorRef
  ) {}

  ngOnInit(): void {
    console.log(this.record);
    this.getRecordList();
    this.getContractList();
  }
  getRecordList(): void {
    const current: number = this.page.current || 1;
    const size: number = this.page.size || 10;
    this.http
      .get(
        Api.CustomerRecordListApi,
        {
          current: current,
          size: size,
          customerId: this.record.id
        },
        { context: new HttpContext().set(ALLOW_ANONYMOUS, true) }
      )
      .subscribe((res: any) => {
        if (res && res.code === ResponseCode.SUCCESS) {
          if (res.data) this.page = res.data;
        }
      });
  }
  close() {
    this.modal.destroy();
  }
  getContractList() {
    if (this.record.id) {
      this.http
        .post(
          Api.CustomerContractListApi,
          { id: this.record.id },
          { id: this.record.id },
          { context: new HttpContext().set(ALLOW_ANONYMOUS, true) }
        )
        .subscribe((res: any) => {
          if (res) {
            if (res.code === ResponseCode.SUCCESS) {
              if (res.data) {
                this.contract = res.data;
              }
            }
          }
        });
    }
  }
}
